/*
 * @Author: liyongxuan
 * @Date: 2018-1-10 10:37:42
 * @Last Modified by: liyongxuan
 * @Last Modified time: 2018-1-10 10:37:42
 * @description项目管理-拟投资
 */
<!--项目管理-拟投资 -->
<template>
    <div>
        <div class="right__detail">
            <!-- 拟投资头部组件 -->
            <csHeader :itemId="itemID" @projectMan="projectMan" :transform="true"></csHeader>
            <el-tabs type="border-card" v-model="tabIndex" class="ca-tabs ca-m-t-15" @tab-click="handleClick">
                <el-tab-pane :label="tabArr[0]" :disabled="!isNoAuth('项目库-项目详情-查看')">
                    <!-- 项目详情 -->
                    <csRedDot slot="label" :label="tabArr[0]" :showDot="dotStateList[0]"></csRedDot>
                    <csProDetail v-if="tabIndex==0" :itemId="itemID"></csProDetail>
                </el-tab-pane>
            </el-tabs>
        </div>
    </div>
</template>

<script type='text/ecmascript-6'>
    import { getDetailRemind,read,isNoAuth } from '__service/utils';
    export default {
        data() {
            return {
                proMan: null,
                tabArr: ['项目详情'],//tab名称
                itemID: this.$route.params.itemId,
                tabIndex: this.$route.params.tabIndex + '' || '0',//页面索引
                dotStateList: [false], // 小红点状态
            }
        },
        beforeRouteEnter(to, from, next) {
            next( vm => {
                if (!isNoAuth('项目库-项目详情-查看')) {
                    vm.$message({
                        message: '没有此页面的操作权限',
                        type: 'error',
                        center: true
                    });
                    vm.$router.replace({name: 'personal-center', params: {tabIndex: '0', openWindow: false}})
                }
            })
        },
        mounted() {
            isNoAuth('')
            this.getDotList()
            // 为子组件创建的第三方组件方法
            this.$root.Dot.$on('getDotList', () => {
                this.getDotList();
            })
        },
        methods: {
            projectMan(val) {
                this.proMan = val
            },
            // 设置小红点状态
            async getDotList() {
                const dotList = await getDetailRemind({ dataId: this.$route.params.itemId, dataType: 1 });
                dotList.map(x => {
                    this.dotStateList[x.dataTab] = true;
                });
                this.dotStateList = this.dotStateList.concat([]);
            },
            // 切换tab
            handleClick(val) {
                //去除小红点
                read({ dataId: this.$route.params.itemId, dataTab: val.index, dataType: 1 });
                this.dotStateList[val.index] = false;
                this.dotStateList = this.dotStateList.concat([]);
                // 设置小红点状态 end
            },
        },
        beforeDestroy() {
            // 销毁小红点第三方vue
            this.$root.Dot.$off('getDotList');
        },
        components: {
            csHeader: require('../pre-investment-project/header/index'),//项目库详情头部
            csProDetail: require('./proDetail/index'),//项目详情
            csRedDot: require('__components/red-dot'), // 小红点
        },
    }
</script>
<style rel='stylesheet/scss' lang='scss' scoped>

</style>
